<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>05_ES6常用语法</title>
  </head>
  <body>
    <script>
      /* 
      1. let与const
      2. 解构赋值

      3. 字符串扩展: 模板字符串
      4. 对象扩展: 属性简写与方法简写, 扩展符
      5. 数组扩展: 扩展符, find/findIndex/includes
      6. 函数扩展: 箭头函数 / 参数默认值 / 剩余参数

      7. 类语法: class / constructor / extends / super / static
      8. 异步语法: Promise / async & await
      9. 模块化语法: export / default / import
      */

      /* 3. 字符串扩展: 模板字符串 */
      let p = {
        name: 'tom',
        age: 12
      }
      const info = `我叫${p.name}, 今年${p.age}`

      /*  4. 对象扩展: 属性简写与方法简写, 扩展符 */
      let age = 12
      const p2 = {age, test () {}}

      const p3 = {...p} // 拷贝对象
      const p4 = {sex: '男'} 
      const p5 = {...p3, ...p4} // 合并对象

      /* 5. 数组扩展: 扩展符, find/findIndex/includes */
      const arr1 = [1, 3]
      const arr2 = [...arr1] // 拷贝数组
      const arr3 = [...arr1, ...arr2] // [1, 3, 1, 3]  合并数组
        
      // 6. 函数扩展: 箭头函数 / 参数默认值 / 剩余参数
      const fn = () => ({m: 1, n: 2})
      const fn2 = a => a + 1
      function fn3(a=2) {
        
      }
      fn3()
      fn3(undefined)
      function fn4(a, ...args) {// args [3, 4, 5]
        
      }
      fn4(2, 3, 4, 5)

      function fn5(...args) { // 所有实参组成的数组
        
      }
      fn5(2, 3, 4, 5)
    </script>
  </body>
</html>
